import React, { Component } from 'react'
import MouseCatChild from './MouseCatChild'

export default class Cat extends Component {
  render () {
    return (
      // <div>
      //   <MouseCatChild
      //     render={position => {
      //       return (
      //         <img
      //           src='https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2Ff2ea1112-f62b-45e1-842b-611e3cf79a8f%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1691833294&t=c1f26ac8c846449d0a480d4cc894fcf8'
      //           style={{
      //             width: 100,
      //             height: 100,
      //             position: 'absolute',
      //             left: position.x,
      //             top: position.y
      //           }}
      //           alt=''
      //         />
      //       )
      //     }}
      //   />
      // </div>

      <div>
        {/* children属性 */}
        {/* <MouseCatChild
          children={position => {
            return (
              <img
                src='https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2Ff2ea1112-f62b-45e1-842b-611e3cf79a8f%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1691833294&t=c1f26ac8c846449d0a480d4cc894fcf8'
                style={{
                  width: 100,
                  height: 100,
                  position: 'absolute',
                  left: position.x,
                  top: position.y
                }}
                alt=''
              />
            )
          }}
        /> */}
        <MouseCatChild>
          {position => {
            return (
              <img
                src='https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2Ff2ea1112-f62b-45e1-842b-611e3cf79a8f%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1691833294&t=c1f26ac8c846449d0a480d4cc894fcf8'
                style={{
                  width: 100,
                  height: 100,
                  position: 'absolute',
                  left: position.x,
                  top: position.y
                }}
                alt=''
              />
            )
          }}
        </MouseCatChild>
      </div>
    )
  }
}
